// function drawBall(id) {
//     var canvas = document.getElementById("canvas" + id);
//     var ctx = canvas.getContext("2d");
//     //随机函数
//     function randomNum(m, n) {
//         return Math.floor(Math.random() * (n - m + 1) + m);
//     }
//     //创建小球类
//     function Ball(x, y) {
//         //随机小球半径
//         this.r = 40;
//         //随机颜色
//         this.color = 'rgb(' + randomNum(0, 255) + ',' + randomNum(0, 255) + ',' + randomNum(0, 255) + ')';
//         //随机小球的位置
//         this.x = x;
//         this.y = y;
//         //随机小球速度
//         this.speedX = randomNum(2, 5) * randomNum(0, 1) ? 1 : -1;
//         this.speedY = randomNum(2, 5) * randomNum(0, 1) ? 1 : -1;
//     }
//     //小球移动
//     Ball.prototype.move = function () {
//         this.x += this.speedX;
//         this.y += this.speedY;
//         //判断是否碰到边界
//         //左边界
//         if (this.x <= this.r) {
//             this.x = this.r;
//             //反弹
//             this.speedX *= -1;
//         }
//         //右边界
//         if (this.x >= canvas.width - this.r) {
//             this.x = canvas.width - this.r;
//             this.speedX *= -1;
//         }
//         if (this.y <= this.r) {
//             this.y = this.r;
//             this.speedY *= -1;
//         }
//         if (this.y >= canvas.height - this.r) {
//             this.y = canvas.height - this.r;
//             this.speedY *= -1;
//         }
//     }
//     //绘制小球
//     Ball.prototype.drawBall = function () {
//         ctx.beginPath();
//         ctx.arc(this.x, this.y, this.r, 0, Math.PI * 2, false);
//         ctx.fillStyle = this.color;
//         ctx.fill();

//     }
//     //创建小球的对象
//     var balls = [];

//     var ball1 = new Ball(50, 50);
//     balls.push(ball1);
//     var ball2 = new Ball(200, 50);
//     balls.push(ball2);
//     var ball3 = new Ball(150, 170);
//     balls.push(ball3);
//     //让小球移动
//     setInterval(function () {
//         ctx.clearRect(0, 0, canvas.width, canvas.height);
//         for (var i = 0; i < balls.length; i++) {
//             balls[i].move();
//             balls[i].drawBall();
//             //移动后检测小球碰撞反弹
//             for (j = 0; j < balls.length; j++) {
//                 //判断不是同一个球
//                 if (balls[i] == balls[j]) {
//                     continue;//不做碰撞检测
//                 }
//                 //碰撞检测
//                 if (ballCrash(balls[i], balls[j])) {
//                     //互换速度
//                     //使用第三个变量
//                     var tempX = balls[i].speedX;
//                     balls[i].speedX = balls[j].speedX;
//                     balls[j].speedX = tempX;
//                     var tempY = balls[i].speedY;
//                     balls[i].speedY = balls[j].speedY;
//                     balls[j].speedY = tempY;
//                 }
//             }
//         }
//     }, 0.1)
//     //碰撞检测
//     function ballCrash(ball1, ball2) {
//         //两个小球之间的距离
//         var distance = Math.sqrt(Math.pow(ball1.x - ball2.x, 2) + Math.pow(ball1.y - ball2.y, 2));
//         if (distance <= ball1.r + ball2.r) {
//             return true;//碰撞
//         } else {
//             return false;//没有碰撞
//         }
//     }
// }

// function addCSS() {
//     var path = window.location.pathname;
//     var index = path.lastIndexOf("/");
//     path = path.substr(0, index);
//     var css = document.createElement("link");
//     css.rel = "stylesheet";
//     css.href = path + "/scripts/plugins/collision/default.css";
//     var head = document.querySelector("head");
//     head.appendChild(css);
// }
// //创建画布
// function creatCanvas(id) {
//     var ca = document.createElement("canvas");
//     ca.id = "canvas" + id;
//     ca.style.width = "320px";
//     ca.style.height = "240px";
//     return ca;
// }

// (function () {
//     addCSS();
//     var el = document.querySelectorAll(".canvas");
//     for (var i = 0; i < el.length; i++) {
//         el[i].appendChild(creatCanvas(i));
//         drawBall(i);
//     }
// })();